<template>
	<view class="warp" v-if="dataInfo.baZiInfo.daYunLu">
		<!-- 自定义导航栏 -->
		<!-- <uni-nav-bar background-color="#f2f2f2" 
		color="#7e6a52" :border="false" :fixed="true"
		 @clickLeft="left"  left-icon="left"  leftWidth="50rpx"
		  rightWidth="10rpx" :statusBar="true" height="88rpx">
		   <view class="title_box">
		 	 <view class="left">
				<view class="left_text">
					自己
				</view>
				<view class="left_icon">
					<uni-icons color="#7e6a52" @click="idcard=!idcard" v-if="idcard" type="down" size="14"></uni-icons>
				    <uni-icons color="#7e6a52" @click="idcard=!idcard" v-else type="up" size="14"></uni-icons>
				</view>
			</view>
		 	<view class="right">
		 	<uni-icons color="#7e6a52" style="margin-right: 20rpx;" custom-prefix="iconfont" type="icon-shenfenqiehuan" size="20"></uni-icons>
		 	<uni-icons color="#7e6a52" custom-prefix="iconfont" type="icon-fenxiang" size="22"></uni-icons>
			</view>
		   </view>
		</uni-nav-bar> -->
		<view class="tab">
			
		</view>
		<view class="cont_box" >
			<view class="lushen" :class="{'boyactive':iszhedie}">
				<view class="title">
					<span class="line"></span>
					<span>禄神</span>
				</view>
				<view class="content" v-if="dataInfo.baZiInfo.daYunLu">
					{{dataInfo.baZiInfo.daYunLu}}
				</view>
				
			</view>
			<view class="isactive" v-if="!iszhedie">
				<view  class="isactive_button" @click="changefn">
					<view class="">
						点击展开更多信息
					</view>
					<uni-icons color="#947651" type="down" size="20"></uni-icons>
				</view>
			</view>
			<view class="zhedie" @click="changefn" v-if="iszhedie">
				<view class="zhedie_button">
					<uni-icons color="#947651" type="up" size="20"></uni-icons>
					<view class="">
						点击收起
					</view>
				</view>
			</view>
			<!-- 事业 -->
			<view class="shiye" :class="{'boyactive':iszhedie1}">
				<view class="title">
					
					<span class="line"></span>
					<span>事业</span>
				</view>
				<view class="content" v-if="dataInfo.shiYe">
					{{dataInfo.shiYe}}
				</view>
			</view>
			<view class="isactive" v-if="!iszhedie1">
				<view  class="isactive_button" @click="changefn1">
					<view class="">
						点击展开更多信息
					</view>
					<uni-icons color="#947651" type="down" size="20"></uni-icons>
				</view>
			</view>
			<view class="zhedie" @click="changefn1" v-if="iszhedie1">
				<view class="zhedie_button">
					<uni-icons color="#947651" type="up" size="20"></uni-icons>
					<view class="">
						点击收起
					</view>
				</view>
			</view>
			<view class="xingge" :class="{'boyactive':iszhedie2}">
				<view class="title">
					 
					<span class="line"></span>
					<span>性格</span>
				</view>
				<view class="content" v-if="dataInfo.xingGe">
					{{dataInfo.xingGe}}
				</view>
			</view>
			<view class="isactive" v-if="!iszhedie2">
				<view  class="isactive_button" @click="changefn2">
					<view class="">
						点击展开更多信息
					</view>
					<uni-icons color="#947651" type="down" size="20"></uni-icons>
				</view>
			</view>
			<view class="zhedie" @click="changefn2" v-if="iszhedie2">
				<view class="zhedie_button">
					<uni-icons color="#947651" type="up" size="20"></uni-icons>
					<view class="">
						点击收起
					</view>
				</view>
			</view>
			<view class="jiankang" :class="{'boyactive':iszhedie3}">
				<view class="title">
					 
					<span class="line"></span>
					<span>健康</span>
				</view>
				<view class="content" v-if="dataInfo.jianKang">
					{{dataInfo.jianKang}}
				</view>
			</view>
			<view class="isactive" v-if="!iszhedie3">
				<view  class="isactive_button" @click="changefn3">
					<view class="">
						点击展开更多信息
					</view>
					<uni-icons color="#947651" type="down" size="20"></uni-icons>
				</view>
			</view>
			<view class="zhedie" @click="changefn3" v-if="iszhedie3">
				<view class="zhedie_button">
					<uni-icons color="#947651" type="up" size="20"></uni-icons>
					<view class="">
						点击收起
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {mapState,mapMutations} from 'vuex'
	import other from '@/components/other/index.vue'
	export default{
		components:{other},
		data(){
			return{
				url:'https://thirdwx.qlogo.cn/mmopen/vi_32/POgEwh4mIHO4nibH0KlMECNjjGxQUq24ZEaGT4poC6icRiccVGKSyXwibcPq4BWmiaIGuG1icwxaQX6grC9VemZoJ8rg/132',
				useInfo:"",
				dataInfo:{},
				baziInfo:{},//八字五行 天干地支
				shishen:{},//十神
				cangGan:{},//藏干
				nayin:{},//纳音
				changsheng:{},//长生
				liunianindex:{},//当前流年
				liunianlist:[],//流年
				number2:0,//默认流年
				idcard:true,//身份卡片
				numCount:{
					jin:0,
					mu:0,
					shui:0,
					huo:0,
					tu:0,
				},
				auditShow:false,
				shiyelist:[],//事业
				// 1111
				number1:0,
				uerinfo:{},//用户信息
				baziluinfo:{},
				iszhedie:false,//折叠
			    iszhedie1:false,
				iszhedie2:false,
				iszhedie3:false,
				iszhedie4:false,
			}
		},
		onLoad(){},
		onShow(){
		this.getAudit()
			this.getUserInfo();
		},
		// 下拉刷新
		
		computed: {
			...mapState(['hasLogin', 'userInfo', 'userCenterData'])
		},
		methods:{
			left(){
				uni.navigateBack({delta:1})
			},
			//跳转
			changefn(){
				this.iszhedie=!this.iszhedie
			},
			changefn1(){
				this.iszhedie1=!this.iszhedie1
			},
			changefn2(){
				this.iszhedie2=!this.iszhedie2
			},
			changefn3(){
				this.iszhedie3=!this.iszhedie3
			},
			
			
			//获取微信审核开关
			getAudit(){
			    let param = {};
				param.url='v3/system/front/configuration/1'
				this.$request(param).then(res=>{
					console.log(res);
					this.auditShow=res.data.auditSwitch
					if(this.auditShow){
						uni.setNavigationBarTitle({
							title:'八字排盘'
						})
					}
					
				})
			},
			getUserInfo(){
				if(!this.hasLogin){
					this.useInfo=uni.getStorageSync('exampleInfo')
					
					let data={
						name:this.useInfo.masterName,
						year:this.useInfo.masterBirthday.split(' ')[0].split('/')[0],
						month:this.useInfo.masterBirthday.split(' ')[0].split('/')[1],
						day:this.useInfo.masterBirthday.split(' ')[0].split('/')[2],
						hour:this.useInfo.masterBirthday.split(' ')[1].split(':')[0],
						minute:this.useInfo.masterBirthday.split(' ')[1].split(':')[1],
						selectAddressCode:this.useInfo.masterAddressCode,
						selectAddress:this.useInfo.masterAddress,
						gender:this.useInfo.masterSex,
						isLeap:this.useInfo.isLeap
					}
					
					if(data.isLeap === null){
						this.getFortune(data)
					}else if(data.isLeap.toString() =='true' ||data.isLeap.toString() =='false'){
						 this.getFortune2(data)
					}
				}else{
					let param = {};
					param.url='v3/member/front/master/detail'
					this.$request(param).then(res =>{
						console.log(res);
						if(res.data){
							this.useInfo=res.data
							let data={
								name:res.data.masterName,
								year:res.data.masterBirthday.split(' ')[0].split('/')[0],
								month:res.data.masterBirthday.split(' ')[0].split('/')[1],
								day:res.data.masterBirthday.split(' ')[0].split('/')[2],
								hour:res.data.masterBirthday.split(' ')[1].split(':')[0],
								minute:res.data.masterBirthday.split(' ')[1].split(':')[1],
								selectAddressCode:res.data.masterAddressCode,
								selectAddress:res.data.masterAddress,
								gender:res.data.masterSex,
								isLeap:res.data.isLeap
							}
							
							if(res.data.isLeap === null){
								this.getFortune(data)
							}else if(res.data.isLeap.toString() =='true' ||res.data.isLeap.toString() =='false'){
								 this.getFortune2(data)
							}
						}else{
							this.useInfo=uni.getStorageSync('exampleInfo')
							let data={
								name:this.useInfo.masterName,
								year:this.useInfo.masterBirthday.split(' ')[0].split('/')[0],
								month:this.useInfo.masterBirthday.split(' ')[0].split('/')[1],
								day:this.useInfo.masterBirthday.split(' ')[0].split('/')[2],
								hour:this.useInfo.masterBirthday.split(' ')[1].split(':')[0],
								minute:this.useInfo.masterBirthday.split(' ')[1].split(':')[1],
								selectAddressCode:this.useInfo.masterAddressCode,
								selectAddress:this.useInfo.masterAddress,
								gender:this.useInfo.masterSex,
								isLeap:this.useInfo.isLeap
							}
							
							if(data.isLeap === null){
								this.getFortune(data)
							}else if(data.isLeap.toString() =='true' ||data.isLeap.toString() =='false'){
								 this.getFortune2(data)
							}
						}
					})
				}
			},
			//阳历获取天干
			getFortune(value){
				// console.log('qe');
				// console.log('value',value);
				let param = {};
				param.urls='scbz/convertedCalendar'
				param.data=value
				param.header={
					'Content-Type': 'application/json;charset=utf-8',
				}
				this.$request(param).then(res=>{
					// console.log('res1',res);
					this.dataInfo=res
					// 数据处理
					const regex = /\d+\./g;
					const array1 = this.dataInfo.shiYe.split(regex).filter(Boolean);
					this.shiyelist=array1.map((item, index) => `${index + 1}.${item}`);
					// console.log(this.shiyelist,'222');
					this.baziInfo=res.baZiWuXing
					this.shishen=res.shiShen
					this.cangGan=res.cangGan
					this.nayin=res.naYin
					this.changsheng=res.changSheng
					this.liunianlist=res.liuNians
					this.getNum()
				})
			},
			//阴历获取天干
			getFortune2(value){
			
				let param = {};
				param.urls='scbz/convertedSolarCalendar'
				param.data=value
				param.header={
					'Content-Type': 'application/json;charset=utf-8',
				},
				this.$request(param).then(res=>{
					console.log(res);
					this.dataInfo=res
					this.baziInfo=res.baZiWuXing
					this.shishen=res.shiShen
					this.cangGan=res.cangGan
					this.nayin=res.naYin
					this.changsheng=res.changSheng
					this.liunianlist=res.liuNians
					this.getNum()
				})
			},
			getNum(){
				let arr=[]
				this.numCount.jin=0
				this.numCount.mu=0
				this.numCount.shui=0
				this.numCount.huo=0
				this.numCount.tu=0

				arr.push(this.baziInfo.nianZhu.tianGan.wuXing)
				arr.push(this.baziInfo.yueZhu.tianGan.wuXing)
				arr.push(this.baziInfo.riZhu.tianGan.wuXing)
				arr.push(this.baziInfo.shiZhu.tianGan.wuXing)
				arr.push(this.baziInfo.nianZhu.diZhi.wuXing)
				arr.push(this.baziInfo.yueZhu.diZhi.wuXing)
				arr.push(this.baziInfo.riZhu.diZhi.wuXing)
				arr.push(this.baziInfo.shiZhu.diZhi.wuXing)
				console.log('arr',arr);
				arr.forEach((item)=>{
					if(item=='金'){
						this.numCount.jin+=1
					}else if(item=='木'){
						this.numCount.mu+=1
					}else if(item=='水'){
						this.numCount.shui+=1
					}else if(item=='火'){
						this.numCount.huo+=1
					}else if(item=='土'){
						this.numCount.tu+=1
					}
				})
			},
			userChange(){
				this.$tab.navigateTo('/pages/index/archives')
			},
		}
	}
</script>
<style lang="scss" scoped>
 page{
	background-color: #f2f2f2;
 }
.warp{
	.title_box{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		.left{
			display: flex;
			align-items: center;
			.left_text{
				font-size: 15px;
				margin-right: 10rpx;
				
			}
			.left_icon{
				width: 15px;
				height: 15px;
				text-align: center;
				line-height: 15px;
				border: 2rpx solid #323333;
				border-radius: 50%;
				
			}
			
		}
	}
	.cont_box{
		// padding: 20rpx;
		.lushen,.shiye,.xingge,.jiankang{
			padding: 20rpx 40rpx;
			background-color: #fffcf7;
			border-radius: 20rpx 20rpx 0 0;
			text-align: left;
			max-height: 300rpx;
			overflow: hidden;
			
			.title{
				border-bottom: 2rpx solid #cecece;
				font-size: 38rpx;
				font-weight: 550;
				color: #81532f;
				letter-spacing: 6rpx;
				padding-bottom: 20rpx;
				display: flex;
				align-items: center;
				.line{
					width: 10rpx;
					height: 40rpx;
					background-color: #81532f;
					border-radius: 4rpx;
					margin-right: 10rpx;
					display: inline-block;
					margin-right: 20rpx;
					
				}
			}
			
			.content{
				padding: 20rpx 0;
				color: #947651;
				letter-spacing: 6rpx;
				font-size: 28rpx;
				text-align: left;
		
			
			}
			
		}
		// 折叠
		.isactive{
			padding: 20rpx;
			text-align: center;
			color: #947651;
			font-size: 24rpx;
			border-radius:0 0 20rpx 20rpx;
			background: linear-gradient(to bottom, #fffcf7 60%, #fcf9f5);
			// background-color: #fffcf7;
		margin-bottom: 20rpx;
		}
		.zhedie{
			 
			padding: 6rpx 0;
			text-align: center;
			color: #947651;
			font-size: 24rpx;
			border: 2rpx solid #f3f3f3;
			border-radius:0 0 20rpx 20rpx;
		    background-color: #fffcf7;
		   margin-bottom: 20rpx;
		}
		.boyactive{
			max-height: 1500rpx;
			// background-color: #00b300;
		}
	}
}
</style>
